<template>
	<view class="cityContent">
		<view class="conlation">
			<view class="iconfont icon-dingwei conlation-left">
				自动定位: {{tcity}}
			</view>
			<!-- 关闭当前页面，跳转到指定页面 -->
			<navigator   url="/pages/changeCity/changeCity" class="conlation-right">
				切换<text class="iconfont icon-arrow-right"></text>
			</navigator>
		</view>
		<view class="video-list">
			<view class="item">
				<view class="video">
					<video  
					style="width: 100%;height: 100%;"  
					objectFit="fill"
					src="http://124.221.26.166:8080/videos/video/3.mp4" controls></video>
				</view>
				<view class="img">
					<image  class="image-box" src="http://124.221.26.166:8080/pic/girl.jpg" ></image>
				</view>
			</view>
			<view class="item">
				<view class="video">
					<video  
					style="width: 100%;height: 100%;"  
					objectFit="fill"
					src="http://124.221.26.166:8080/videos/video/7.mp4" controls></video>
				</view>
				<view class="img">
					<image  class="image-box" src="http://124.221.26.166:8080/pic/girl.jpg" ></image>
				</view>
			</view>
			<view class="item">
				<view class="video">
					<video  
					style="width: 100%;height: 100%;"  
					objectFit="fill"
					src="http://124.221.26.166:8080/videos/video/1.mp4" controls></video>
				</view>
				<view class="img">
					<image  class="image-box" src="http://124.221.26.166:8080/pic/girl.jpg" ></image>
				</view>
			</view>
			<view class="item">
				<view class="video">
					<video  
					style="width: 100%;height: 100%;"  
					objectFit="fill"
					src="http://124.221.26.166:8080/videos/video/3.mp4" controls></video>
				</view>
				<view class="img">
					<image  class="image-box" src="http://124.221.26.166:8080/pic/girl.jpg" ></image>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		// 接收来自city页面的城市名
		props:['tcity'],
		name:"cityContent",
		data() {
			return {
				tcity:"北京"
			};
		},
		onShow(){
			uni.getStorage({
				key:'city',
				success: (res) => {
					this.tcity=res.data
				}
			})
		}
	}
</script>

<style>
	.cityContent{
		width: 100%;
		background: #000000;
		z-index: 18;
	}
	.conlation{
		width: 100%;
		height: 40px;
		padding-top: 70px;
		overflow: hidden;
		color: #aaaaaa;
	}
	.conlation-left{
		float: left;
		font-size: 13px;
		padding-left: 15px;
	}
	.conlation-right{
		float: right;
		font-size: 13px;
		padding-right: 15px;
	}
	.video-list{
		width: 100%;
		overflow: auto;
		background: #000000;
	}
	.item{
		width: 50%;
		float: left;
		position: relative;
	}
	.video{
		width: 92%;
		height: 300px;
		margin-left: 4%;
		z-index:18;
	}
	.img{
		position: absolute;
		bottom: 7px;
		right: 15px;
	}
	.image-box{
		width: 30px;
		height: 30px;
		border-radius: 50%;
	}

</style>